<template>
  <div class="in-common" @click="patientInformationClick">病人信息</div>
  <div class="in-common two" @click="diagnosisClick">诊断</div>
  <div class="in-common three" @click="refundItemClick">退费</div>
  <div class="in-common four" @click="drugRepercussionClick">退药</div>
  <div class="in-common five" @click="nurseAutoItemEnterClick">固定费用录入</div>
  <div class="in-common six" @click="costsSelectClick('费用核对')">费用核对</div>
  <div class="in-left-common" @click="temperatureChart">体温单</div>
  <div class="in-left-common eight" @click="dischargedNotDoneItemClick">出院未做项目</div>
  <div class="app-container" style="margin: 0px 15px 0px 20px;">
    <div class="search-container" style="margin-top: -5px; background-color: #d5e9ff;padding-top: 5px;">
      <el-form ref="showParamsRef" :inline="true" :model="showParams" label-width="70px">
        <el-row style="margin-bottom: -15px;">
          <el-col :span="6">
            <el-form-item label="患者信息" prop="inFlag">
              <span class="mr10">
                {{ showParams.name + ' ' }}
              </span>
              <span class="mr10">{{ showParams.ageAll }}
              <svg-icon :icon-class="dictStore.getMateDictInfo(dictDataMap['sys_user_sex'], showParams.sex)
                                .dictValue === '1'
                                ? 'man'
                                : 'woman'
                                "/></span>
            </el-form-item>
          </el-col>
          <el-col :span="3">
            <el-form-item label="住院号:" prop="hospitalNo">
              <span class="ys-css">{{ showParams.hospitalNo }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="3" class="ml20">
            <el-form-item label="住院天数:" prop="hospitalizationDays">
                            <span class="ys-css">{{
                                showParams.hospitalizationDays ? showParams.hospitalizationDays :
                                  "0"
                              }}</span>天
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item label="总费用:" prop="hospitalizationDays">
                            <span class="ys-css" style="color: #ff0000;">{{
                                showParams.expensesIncurred ?
                                  showParams.expensesIncurred.toFixed(2) :
                                  0.00
                              }}</span>元
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item label="预交金:" prop="patPrepaymentSum">
                            <span class="ys-css">{{
                                showParams.patPrepaymentSum
                                  ? showParams.patPrepaymentSum.toFixed(2) : 0.00
                              }}</span>元
            </el-form-item>
          </el-col>
          <el-col :span="3">
            <el-form-item label="收费类别:" prop="patPrepaymentSum">
              {{
                dictStore.getMateDictInfo(
                  dictDataMap["medical_insurance_type"],
                  showParams.chargeType
                )
                  ? dictStore.getMateDictInfo(
                    dictDataMap["medical_insurance_type"],
                    showParams.chargeType
                  ).dictLabel
                  : ""
              }}
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <nurse-orders ref="nurseOrdersRef" :patient-id="patientIdThis" :visit-id="visitIdThis"
                  @costs-select-click="costsSelectClick" @eighteen-click="eighteenClick"/>
    <el-drawer
      v-model="drawer"
      :before-close="drawerClose"
      :close-on-click-modal="false"
      :direction="direction"
      :size="drawerSize"
      :title="drawerTitle"
    >
      <template #header>
        <div class="ml20 fz15" style="color: #00c0ef">
          <span class="mr20" style="font-size: 16px;font-weight: bold;color: #484848">{{ drawerTitle }}</span>
          <span class="fz15 mr5" style="color: #7171ff">{{
              showParams.name
            }}
                    </span>
          <!--                    {{showParams}}-->
          <span class="mr10"><span class="mr5">{{ showParams.age }} 岁{{ showParams.ageMonth }} 月{{
              showParams.ageDay
            }}天{{
              showParams.ageHours
            }}小时</span>

                            <svg-icon :icon-class="dictStore.getMateDictInfo(dictDataMap['sys_user_sex'], showParams.sex)
                                .dictValue === '1'
                                ? 'man'
                                : 'woman'
                                "/>&nbsp;&nbsp;|</span>
          <span>住院号：<span class="ys-css">{{ showParams.hospitalNo }}&nbsp;&nbsp;|</span></span>
          <span>床号：<span class="ys-css">{{ showParams.bedNo }}&nbsp;&nbsp;|</span></span>
          <span>收费类别：<span class="ys-css">{{
              dictStore.getMateDictInfo(
                dictDataMap["medical_insurance_type"],
                showParams.chargeType
              )
                ? dictStore.getMateDictInfo(
                  dictDataMap["medical_insurance_type"],
                  showParams.chargeType
                ).dictLabel
                : ""
            }}</span>
                    </span>
        </div>
      </template>
      <template #default>
        <patient-info v-if="drawerType === 'patientInformation'" ref="patientInfRef" :org-id="userInfo.orgId"
                      :patient-id="patientIdThis" :visit-id="visitIdThis" @save-ok="drawerClose"/>
        <diagnosis v-if="drawerType === 'diagnosis'" ref="diagnosisRef" :is-doctor="false"
                   :org-id="userInfo.orgId"
                   :patient-id="patientIdThis" :visit-id="visitIdThis"/>
        <drug-repercussion-index v-if="drawerType === 'drugRepercussionIndex'" ref="drugRepercussionIndexRef"
                                 :is-return-ok="false" :patient-id="patientIdThis" :visit-id="visitIdThis"/>
        <inp-bill-detail v-if="drawerType === 'inpBillDetailIndex'" ref="inpBillDetailRef"
                         :is-show-query="false" :patient-id="patientIdThis" :visit-id="visitIdThis"/>
        <refund-item v-if="drawerType === 'refundItemIndex'" ref="refundItemRef"
                     :is-show-query="false" :patient-id="patientIdThis" :visit-id="visitIdThis"/>
        <discharged-not-done-item v-if="drawerType === 'dischargedNotDoneItemIndex'"
                                  ref="dischargedNotDoneItemRef"
                                  :is-show-query="false" :patient-id="patientIdThis" :visit-id="visitIdThis"
        />
        <nurse-auto-item v-if="drawerType === 'nurseAutoItemEnterIndex'"
                         ref="nurseAutoItemEnterRef" :is-show-query="false"
                         :patient-id="patientIdThis" :show-params="showParams" :visit-id="visitIdThis"
        />
        <!-- 护士费用补录 -->
        <nurse-bill-detail v-if="drawerType === 'nurseBillDetailIndex'" ref="nurseBillDetailRef"
                           :is-show-query="false" :show-params="showParams"/>
        <!--                <pat-discharge ref="patDischargeRef" v-if="drawerType === 'toHospitalToday'" :visit-id="visitIdThis"-->
        <!--                               :patient-id="patientIdThis" :org-id="userInfo.orgId" @save-ok="patDischargeClose"-->
        <!--                />-->
      </template>
      <template #footer>
        <div style="flex: auto">
          <el-button @click="cancelClick">取消</el-button>
          <el-button type="primary" @click="confirmClick">
            {{
              drawerType === 'patientInformation' ? '保存' :
                drawerType === 'drugRepercussionIndex' ? '申请退药' :
                  drawerType === 'refundItemIndex' ? '确认退费' : '确定'
            }}
          </el-button>
        </div>
      </template>
    </el-drawer>
  </div>
</template>

<script lang="ts" setup>
import {useUserStoreHook} from "@/store/modules/user.ts";
import {useDictStoreHook} from "@/store/modules/dict.ts";
import {listBedRecAndPatientDoctor} from "@/api/hospitalization/patVisit.ts";
import nurseOrders from "./nurseOrders.vue";
import patientInfo from "@/views/doctor/visitDoctor/patientInfo/patientInfo.vue";
import diagnosis from "@/views/doctor/visitDoctor/patientInfo/diagnosis.vue";
import drugRepercussionIndex from "@/views/drug/drugDisp/drugRepercussionIndex.vue"
import inpBillDetail from "@/views/hospitalization/inpBillDetail/index.vue"
import refundItem from "@/views/hospitalization/inpBillDetail/refundItem.vue"
import dischargedNotDoneItem from "@/views/nurse/dischargedNotDoneItem/index.vue"
import nurseAutoItem from "@/views/nurse/nurseAutoItem/index.vue"
import NurseBillDetail from "@/views/hospitalization/inpBillDetail/nurseBillDetail.vue";

const nurseOrdersRef = ref()
const {proxy} = getCurrentInstance() as any;
const visitIdThis = ref<string>("")
const patientIdThis = ref<string>("")
const useUserStore = useUserStoreHook();
// 登录用户信息
const userInfo = <UserInfoBusi>useUserStore.user.userInfo;
const dictStore = useDictStoreHook();
let dictDataMap = ref(dictStore.isTypeGetData('medical_insurance_type', 'sys_user_sex'))
const currentSelectDept = proxy.$currentSelectDept
// 侧边弹出框
const drawer = ref(false)
// 侧边弹出框 弹出方向
const direction = ref('rtl')
// 侧边弹出框 标题
const drawerTitle = ref("")
// 侧边弹出框 宽度
const drawerSize = ref('30%')
// 右侧弹出框显示内容
const drawerType = ref("patientInformation")
const patientInfRef = ref()
const diagnosisRef = ref()
const drugRepercussionIndexRef = ref()
const inpBillDetailRef = ref()
const refundItemRef = ref()
const nurseAutoItemEnterRef = ref()
const dischargedNotDoneItemRef = ref()
const nurseBillDetailRef = ref()
const showParams = ref<any>({
  visitId: visitIdThis.value
})
const props = defineProps({
  visitId: {
    type: String,
    default: ""
  },
  patientId: {
    type: String,
    default: ""
  }
})
watch(() => props.visitId, (newValue, oldValue) => {
  if (!oldValue || newValue === oldValue) {
    visitIdThis.value = newValue
    // 设置全局ClinicId
    proxy.$setVisitId(visitIdThis.value);
  }
  getList()

}, {deep: true, immediate: true})

watch(() => props.patientId, (newValue, oldValue) => {
  if (!oldValue || newValue === oldValue) {
    patientIdThis.value = newValue
    // 设置全局patientId
    proxy.$setPatientId(patientIdThis.value);
  }

}, {deep: true, immediate: true})

function getList() {
  if (currentSelectDept) {
    const param = {
      visitId: visitIdThis.value,
      orgId: userInfo.orgId
    }
    listBedRecAndPatientDoctor(param).then((res: resType) => {
      if (res.data) {
        showParams.value = res.data[0]
        let patPrepaymentSumThis = 0 as number
        if (showParams.value.patPrepaymentVos) {
          showParams.value.patPrepaymentVos.forEach((patPrepayment: any) => {
            patPrepaymentSumThis += Number(patPrepayment.amountOfMoney)
          })
          showParams.value.patPrepaymentSum = patPrepaymentSumThis
        }
        showParams.value.expensesIncurred = Number(showParams.value.expensesIncurred)
      }
    })
  } else {
    ElMessage.error("请先选择医生的权限科室后，再操作。")
  }
}

/**
 * 费用补录
 */
function eighteenClick() {
  drawerTitle.value = "病人信息"
  drawerSize.value = '70%'
  drawerType.value = "nurseBillDetailIndex"
  drawerOpen()
  const obj = {
    visitId: visitIdThis.value,
    patientId: patientIdThis.value
  }
  nextTick(() => {
    nurseBillDetailRef.value.initOpen(obj)
  })

}

/**
 * 病人信息
 */
function patientInformationClick() {
  drawerTitle.value = "病人信息"
  drawerSize.value = '50%'
  drawerType.value = "patientInformation"
  drawerOpen()
  nextTick(() => {
    patientInfRef.value.initOpen(visitIdThis.value, patientIdThis.value)
  })
}

/**
 * 诊断
 */
function diagnosisClick() {
  drawerTitle.value = "病人诊断"
  drawerSize.value = '80%'
  drawerType.value = "diagnosis"
  drawerOpen()
  nextTick(() => {
    diagnosisRef.value.initOpen(visitIdThis.value, patientIdThis.value)
  })
}

/**
 * 退药
 */
function drugRepercussionClick() {
  drawerTitle.value = "退药"
  drawerSize.value = '80%'
  drawerType.value = "drugRepercussionIndex"
  drawerOpen()
  nextTick(() => {
    const obj = {
      visitId: visitIdThis.value,
      patientId: patientIdThis.value,
    }
    drugRepercussionIndexRef.value.initOpen(obj)
  })
}

/**
 * 退费
 */
function refundItemClick() {
  drawerTitle.value = "退费"
  drawerSize.value = '90%'
  drawerType.value = "refundItemIndex"
  drawerOpen()
  const obj = {
    visitId: visitIdThis.value,
    patientId: patientIdThis.value,
  }
  nextTick(() => {
    refundItemRef.value.initOpen(obj)
  })
}

/**
 * 费用查询
 */
function costsSelectClick(drawerTitleThis: any) {
  drawerTitle.value = drawerTitleThis
  drawerSize.value = '80%'
  drawerType.value = "inpBillDetailIndex"
  drawerOpen()
  const obj = {
    visitId: visitIdThis.value,
    patientId: patientIdThis.value,
  }
  nextTick(() => {
    inpBillDetailRef.value.initOpen(obj)
  })
}

/**
 * 固定费用录入
 */
function nurseAutoItemEnterClick() {
  drawerTitle.value = "固定费用录入"
  drawerSize.value = '80%'
  drawerType.value = "nurseAutoItemEnterIndex"
  drawerOpen()
  const obj = {
    visitId: visitIdThis.value,
    patientId: patientIdThis.value,
  }
  nextTick(() => {
    nurseAutoItemEnterRef.value.initOpen(obj)
  })
}

/**
 * 出院未做项目
 */
function dischargedNotDoneItemClick() {
  drawerTitle.value = "出院未做项目列表"
  drawerSize.value = '80%'
  drawerType.value = "dischargedNotDoneItemIndex"
  drawerOpen()
  const obj = {
    visitId: visitIdThis.value,
    patientId: patientIdThis.value,
  }
  nextTick(() => {
    dischargedNotDoneItemRef.value.initOpen(obj)
  })
}

/*体温单*/
function temperatureChart() {
  const emrURL = 'http://123.139.118.82:9000' //临时写法
  //链接跳转
  let url = `${emrURL}/emrcloud/showRecord/transfer?from=his&name=NursingEntry&orgId=${userInfo.orgId}&patientRegId=${props.visitId}&userId=${userInfo.userId}&currentDeptAreaId=${currentSelectDept}&p1=his&p2=his`
  window.open(url, "_blank")
}

/**
 * 右侧边栏 确定事件
 */
function confirmClick() {

  if (drawerType.value === 'patientInformation') {
    patientInfRef.value.savePatientInfo()
  } else if (drawerType.value === 'drugRepercussionIndex') {
    nextTick(() => {
      drugRepercussionIndexRef.value.submitForm()
    })
  } else if (drawerType.value === 'refundItemIndex') {
    nextTick(() => {
      refundItemRef.value.submitForm()
    })
  }
}

/**
 * 右侧边栏 取消事件
 */
function cancelClick() {
  drawerClose()
}


/**
 * 侧边弹出栏打开事件
 */
function drawerOpen() {
  drawer.value = true
}

/**
 * 侧边弹出栏关闭事件
 */
function drawerClose() {
  if (drawerType.value === 'transferToTheWard') {
    transferToTheWardRef.value.empty()
  } else if (drawerType.value === 'patientInformation') {
    nextTick(() => {
      patientInfRef.value.empty()
    })
  } else if (drawerType.value === 'drugRepercussionIndex') {
    nextTick(() => {
      drugRepercussionIndexRef.value.empty()
    })
  } else if (drawerType.value === 'refundItemIndex') {
    nextTick(() => {
      refundItemRef.value.empty()
    })
  } else if (drawerType.value === 'inpBillDetailIndex') {
    nextTick(() => {
      inpBillDetailRef.value.empty()
    })
  } else if (drawerType.value === 'nurseAutoItemEnterIndex') {
    nextTick(() => {
      nurseAutoItemEnterRef.value.empty()
    })
  }
  drawer.value = false
}
</script>

<style scoped>
:deep(.el-tabs__content) {
  padding: 2px !important;
}

:deep(.el-drawer.rtl) {
  bottom: 0px;
  height: 93%;
  top: 50px;
}

.in-common {
  top: 160px;
  width: 22px;
  right: 0;
  border: 1px solid #4E64F6;
  border-radius: 17px;
}

.two {
  top: 270px;
  background-color: #1ab394;
}

.three {
  top: 340px;
  background-color: #b30606;
}

.four {
  top: 409px;
  background-color: #fe0303;
}

.five {
  top: 478px;
  background-color: #0449ff;
}

.six {
  top: 630px;
  background-color: #d3920a;
}

.seven {
  top: 566px;
  background-color: #026af1;
}

.eight {
  top: 83px;
  background-color: #1ba811;
}

:deep(.el-drawer__header) {
  margin-bottom: 8px;
}

</style>
